Telegram Group & Telegram Channel
🎉 Tailwind CSS v4.1 — тени, маски и удобства для вёрстки

Tailwind обновился до версии 4.1. Формально — минорный апдейт, но на деле получил кучу полезных штук. Особенно для тех, кто много работает с UI и адаптивностью.

Вот что появилось:

Текстовые тени
Добавили text-shadow с 5 размерами (2xslg).
Поддерживаются цветные тени, например:
text-shadow-blue-500/50
📌 Удобно для заголовков и эффекта тиснения — белая полупрозрачная тень + тёмный текст.

🎭 CSS-маски
Новые утилиты mask-* для линейных, радиальных и конических градиентов.
Пример: mask-t-from-50% — плавное затемнение сверху.
Можно комбинировать несколько масок.

🧵 Новый контроль переноса
Появились:
- wrap-normal
- wrap-break-word
- wrap-anywhere

Особенно полезно в flex и grid, где раньше длинные строки могли ломать вёрстку.

🌈 Цветной drop-shadow
Теперь drop-shadow можно раскрашивать:
drop-shadow-xl drop-shadow-indigo-500/50
Работает как фильтр, создаёт мягкое цветное свечение.

📱 Указатели: coarse / fine
Появились префиксы pointer-coarse, pointer-fine и any-pointer-*.
Полезно для адаптации интерфейса под тач или мышку:
<button class="px-3 py-1 pointer-coarse:px-5 pointer-coarse:py-3">Кнопка</button>


🧮 Выравнивание по последней строке
items-baseline-last и self-baseline-last — выравнивают по последней строке текста.
Актуально для карточек, чатов и типографики.

🛟 Безопасное центрирование
justify-center-safe, items-center-safe — если контент не влезает, он смещается влево, а не обрезается.

💻 Поддержка старых браузеров
Работает корректно на Safari 15 и старом Firefox:
- fallback для OKLCH
- отключение @property, если не поддерживается
- корректная деградация теней и градиентов

🧾 @source inline — для safelist в CSS
Можно подключать классы прямо в CSS:
@source inline("text-red-500 lg:bg-blue-100");


🔄 Другие полезности
- noscript: — для стилей без JS
- user-valid: и user-invalid: — UX-дружественная валидация
- details-content: — для <details>
- inverted-colors: — для системной инверсии

🧩 Вывод
Tailwind 4.1 — не про революцию, а про удобные детали, которые приятно использовать.
Обновляться можно без страха — всё совместимо

CutCode
🔥113



tg-me.com/laravel_cutcode/722
Create:
Last Update:

🎉 Tailwind CSS v4.1 — тени, маски и удобства для вёрстки

Tailwind обновился до версии 4.1. Формально — минорный апдейт, но на деле получил кучу полезных штук. Особенно для тех, кто много работает с UI и адаптивностью.

Вот что появилось:

Текстовые тени
Добавили text-shadow с 5 размерами (2xslg).
Поддерживаются цветные тени, например:
text-shadow-blue-500/50
📌 Удобно для заголовков и эффекта тиснения — белая полупрозрачная тень + тёмный текст.

🎭 CSS-маски
Новые утилиты mask-* для линейных, радиальных и конических градиентов.
Пример: mask-t-from-50% — плавное затемнение сверху.
Можно комбинировать несколько масок.

🧵 Новый контроль переноса
Появились:
- wrap-normal
- wrap-break-word
- wrap-anywhere

Особенно полезно в flex и grid, где раньше длинные строки могли ломать вёрстку.

🌈 Цветной drop-shadow
Теперь drop-shadow можно раскрашивать:
drop-shadow-xl drop-shadow-indigo-500/50
Работает как фильтр, создаёт мягкое цветное свечение.

📱 Указатели: coarse / fine
Появились префиксы pointer-coarse, pointer-fine и any-pointer-*.
Полезно для адаптации интерфейса под тач или мышку:

<button class="px-3 py-1 pointer-coarse:px-5 pointer-coarse:py-3">Кнопка</button>


🧮 Выравнивание по последней строке
items-baseline-last и self-baseline-last — выравнивают по последней строке текста.
Актуально для карточек, чатов и типографики.

🛟 Безопасное центрирование
justify-center-safe, items-center-safe — если контент не влезает, он смещается влево, а не обрезается.

💻 Поддержка старых браузеров
Работает корректно на Safari 15 и старом Firefox:
- fallback для OKLCH
- отключение @property, если не поддерживается
- корректная деградация теней и градиентов

🧾 @source inline — для safelist в CSS
Можно подключать классы прямо в CSS:
@source inline("text-red-500 lg:bg-blue-100");


🔄 Другие полезности
- noscript: — для стилей без JS
- user-valid: и user-invalid: — UX-дружественная валидация
- details-content: — для <details>
- inverted-colors: — для системной инверсии

🧩 Вывод
Tailwind 4.1 — не про революцию, а про удобные детали, которые приятно использовать.
Обновляться можно без страха — всё совместимо

CutCode

BY Новости от CutCode




Share with your friend now:
tg-me.com/laravel_cutcode/722

View MORE
Open in Telegram


Новости от CutCode Telegram | DID YOU KNOW?

Date: |

Telegram Be The Next Best SPAC

I have no inside knowledge of a potential stock listing of the popular anti-Whatsapp messaging app, Telegram. But I know this much, judging by most people I talk to, especially crypto investors, if Telegram ever went public, people would gobble it up. I know I would. I’m waiting for it. So is Sergei Sergienko, who claims he owns $800,000 of Telegram’s pre-initial coin offering (ICO) tokens. “If Telegram does a SPAC IPO, there would be demand for this issue. It would probably outstrip the interest we saw during the ICO. Why? Because as of right now Telegram looks like a liberal application that can accept anyone - right after WhatsApp and others have turn on the censorship,” he says.

How To Find Channels On Telegram?

There are multiple ways you can search for Telegram channels. One of the methods is really logical and you should all know it by now. We’re talking about using Telegram’s native search option. Make sure to download Telegram from the official website or update it to the latest version, using this link. Once you’ve installed Telegram, you can simply open the app and use the search bar. Tap on the magnifier icon and search for a channel that might interest you (e.g. Marvel comics). Even though this is the easiest method for searching Telegram channels, it isn’t the best one. This method is limited because it shows you only a couple of results per search.

Новости от CutCode from it


Telegram Новости от CutCode
FROM USA